<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <div style="width: 90vw;height: 100vh;">
        <div id="vabOnlyOffice"></div>
    </div>
    <div>
        <button class="saves">保存</button>
    </div>
    <script src="http://10.215.21.83:9000/web-apps/apps/api/documents/api.js"></script>
    <script src="https://http://10.215.21.83:9000/docbuilder "></script>
    <script>
        var doctype = null
        var docEditor = null
        var option = {
            isEdit: true,
            lang: 'zh-CN',
            title: '123',
            fileType: 'docx',
            isPrint: true,
            user: { id: 12, name: '张三' },
            // editUrl:'http://10.215.21.83:9000/api/v1/onlyoffice/callback',
            editUrl: 'http://10.215.21.83:9066/api/save',
            url: 'http://10.215.21.83:9066/test4500.doc' //带ip本地可打开的地址
        }
        function getFileType(fileType) {
            const fileTypesDoc = ['doc', 'docx', 'txt'];
            const fileTypesCsv = ['csv', 'xls', 'xlsx'];
            const fileTypesPPt = ['ppt', 'pptx'];
            if (fileTypesDoc.includes(fileType)) return 'text';
            if (fileTypesCsv.includes(fileType)) return 'spreadsheet';
            if (fileTypesPPt.includes(fileType)) return 'presentation';
            return '';
        }


        function ichange(e) {
            console.log(e, 'eepp')
            setEditor(option)
        }
        function saves(e) {
            console.log(e, '778899')
        }

        function setEditor(option) {
            const config = {
                document: {
                    fileType: option.fileType,
                    key: option.key || '',
                    title: option.title,
                    permissions: {
                        edit: option.isEdit,
                        print: option.isPrint,
                        download: true,
                    },
                    url: option.url,  //文件url
                },
                documentType: doctype,
                editorConfig: {
                    callbackUrl: option.editUrl,
                    lang: option.lang,
                    customization: {
                        autosave: true, //自动保存
                        chat: false,
                        comments: false,
                        help: false,
                        plugins: false,
                    },
                    user: {  //拓展协同编辑有影响的信息
                        id: option.user.id,
                        name: option.user.name,
                    },
                    mode: 'edit',
                },
                width: '100%',
                height: '100%',
                token: option.token || '', //jwt令牌
                events: {
                    /* 每次编辑变化 */
                    onDocumentStateChange: (e) => {
                    },
                }
            }
            docEditor = new DocsAPI.DocEditor('vabOnlyOffice', config);
        }
        setEditor(option)

        window.addEventListener('keydown', (e) => {
            console.log(e, 'eeeee')
        })

        builder.CreateFile("docx")
        var oDocument = Api.GetDocument();
        console.log(oDocument, '667788')
    </script>
</body>

</html>